<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>首界面</title>
    <link rel="stylesheet" href="../../plugins/bootstrap/css/bootstrap.css" type="text/css">
    <link rel="stylesheet" href="../../css/index/index.css  ">
    <link rel="stylesheet" href="../../css/head.css">
    <!-- <link rel="stylesheet" href="../../css/mian/index.css"> -->

    <style>
        #lunbo {
            width: 100%;
            height: 550px;
        }

        #lunbo img {
            width: 100%;
            height: 550px;
        }

        .boom {
            margin-top: 200px;
        }

        p {
            display: block;
            font-size: 1.17em;
            margin-block-start: 1em;
            margin-block-end: 1em;
            margin-inline-start: 0px;
            margin-inline-end: 0px;
            font-weight: bold;
            color: white;
        }

        .doctor {
            width: 100%;
            height: 100%;
            max-width: 100%;
            border: none;
            vertical-align: middle;
            margin: 0;
            padding: 0;
        }


        .bt {
            width: 130px;
            height: 25px;
            color: white;
            background-color: rgb(6, 134, 6);
            padding: 5px;
            position: relative;
            margin: auto;
            right: 240px;

        }

        hr {
            margin-top: 0px;
            width: 1000px;

            position: relative;

        }

        .ksdh {
            width: 760px;
            height: 450px;
            border: 0.5px solid green;
            margin-left: 10px;
        }

        ul {
            list-style-type: none;
        }

        li {
            padding: 8px;
            color: black;
        }

        /* 链接未访问时的样式 */
        a:link {
            color: rgb(54, 54, 54);
        }

        /* 链接访问之后的样式 */
        a:visited {
            color: rgb(29, 29, 29);
        }

        /* 当鼠标滑过时,a标签的样式 */
        a:hover {
            color: rgb(5, 145, 5);
        }


        a {
            text-decoration: none;
        }

        .footer {
            background: url(../../imgs/foot.jpg) no-repeat center;
            background-size: cover;
            font-size: 12px;
            height: 200px;
        }

        .romve {
            padding-top: 40px;
            margin-left: 200px;
        }


        html {
            height: 100%;
            display: table;
        }

        body {
            display: table-cell;
            height: 100%;
        }
    </style>


</head>

<body>

    <div class="con">
        <!-- 导航开始 -->
        <div>
            <div class="container-fluid">
                <div class="row" style="background-color:rgb(1,81,40)">
                    <ul class="nav navbar-nav navbar-right" style="padding-right: 20px;font-size: 10px;" id="head">
                        <li><a href="#">欢迎&nbspxxx!</a></li>
                        <li><a href="../login.html">安全退出</a></li>
                        <li><a href="../personal/myinfo.html">个人中心</a></li>
                    </ul>
                </div>
            </div>
            <div class="container">
                <div class="row">
                    <ul class="nav navbar-nav" id="daohang" style="width: 100%">
                        <li style="padding-top: 0px;">
                            <img src="../../imgs/logo1 .png" alt="" style="width: 60px; height:60px;">
                        </li>
                        <li><a href="../index/index.html">
                                首页
                            </a></li>
                        <li><a href="../register.html">
                                预约挂号
                            </a></li>
                        <li><a href="../department.html ">
                                科室导航
                            </a></li>

                        <li><a href="../science/science.html">
                                健康科普
                            </a></li>
                        <li><a href="#">
                                留言咨询
                            </a></li>
                        <ul class="nav navbar-nav navbar-right">
                            <li style="padding-top: 10px;"><a href="../map/MapShow.html">医院位置导航<img
                                        src="../../imgs/map.png" style="width: 15px; margin-left:5px "></a></li>
                        </ul>
                    </ul>
                </div>
            </div>
            <!-- 导航结束 -->


            <!--轮播 - banner - begin-->
            <div class="container-fluid" id="lunbo">
                <div class="row">
                    <div id="myCarousel" class="carousel slide">
                        <!-- 轮播（Carousel）指标 -->
                        <ol class="carousel-indicators">
                            <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
                            <li data-target="#myCarousel" data-slide-to="1"></li>
                            <li data-target="#myCarousel" data-slide-to="2"></li>
                        </ol>
                        <!-- 轮播（Carousel）项目 -->
                        <div class="carousel-inner">
                            <div class="item active">
                                <img src="../../imgs/hshow.jpg" alt="First slide">
                            </div>
                            <div class="item">
                                <img src="../../imgs/hshow 1.jpg" alt="Second slide">
                            </div>
                            <div class="item">
                                <img src="../../imgs/hshow.jpg" alt="Third slide">
                            </div>
                        </div>
                        <!-- 轮播（Carousel）导航 -->
                        <a href="#myCarousel" data-slide="prev"> <span _ngcontent-c3="" aria-hidden="true"
                                class="glyphicon "></span></a>

                    </div>
                </div>
            </div>

            <div class="container-fluid" style="margin:0 100px;margin-top: 50px">

                <div class="row">

                    <div class="col-xs-3"
                        style="background-image:url(../../imgs/tszl-img1.jpg);width:307px;height: 200px;margin-left:15px;text-align: center">
                        <img src="../../imgs/i-con1.png" style="margin-top: 60px" />
                        <p style="text-align: center;margin-top: 10px" id="reg">预约挂号</p>
                    </div>
                    <div class="col-xs-3"
                        style="background-image:url(../../imgs/tszl-img2.jpg);width:307px;height: 200px;margin-left:15px;text-align: center">
                        <img src="../../imgs/i-con2.png" style="margin-top: 60px" />
                        <p style="text-align: center;margin-top: 10px " id="nav">科室导航</p>
                    </div>
                    <div class="col-xs-3"
                        style="background-image:url(../../imgs/tszl-img3.jpg);width:307px;height: 200px;margin-left:15px;text-align: center">
                        <img src="../../imgs/i-con3.png" style="margin-top: 60px" />
                        <p style="text-align: center;margin-top: 10px" id="self">病症自查</p>
                    </div>
                    <div class="col-xs-3"
                        style="background-image:url(../../imgs/tszl-img4.jpg);width:307px;height: 200px;margin-left:15px;text-align: center">
                        <img src="../../imgs/i-con4.png" style="margin-top: 60px" />
                        <p style="text-align: center;margin-top: 10px" id="location">定位服务</p>
                    </div>

                </div>

            </div>

            <!--yishi-->
            <div class="container-fluid" style="margin:0 100px;margin-top: 50px">
                <div style="margin-left: 15px">医师信息</div>
                <div class="row">
                    <div class="col-xs-2" style="width:700px;height:600px;margin-left:15px" id="dor">
                        <img src="../../imgs/tx-zj1.jpg" class="doctor" />
                    </div>

                    <div class="col-xs-2" style="width: 560px;height:600px;margin-left:10px">

                        <div class="container-fluid" style="margin-top: 20px">
                            <div class="row">
                                <div class="col-md-3">
                                    <div class="thumbnail" style="height: 180px">
                                        <img src="../../imgs/zjtd-dtu.jpg" alt="通用的占位符缩略图">
                                        <div class="caption" style="overflow:hidden">
                                            <h4 align="center" class="text-success">内科</h4>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-3">
                                    <div class="thumbnail" style="height: 180px">
                                        <img src="../../imgs/zjtd-dtu.jpg" alt="通用的占位符缩略图">
                                        <div class="caption" style="overflow:hidden">
                                            <h4 align="center" class="text-success">内科</h4>
                                        </div>
                                    </div>
                                </div>

                                <div class="col-md-3">
                                    <div class="thumbnail" style="height: 180px">
                                        <img src="../../imgs/zjtd-dtu.jpg" alt="通用的占位符缩略图">
                                        <div class="caption" style="overflow:hidden">
                                            <h4 align="center" class="text-success">内科</h4>
                                        </div>
                                    </div>
                                </div>

                                <div class="col-md-3">
                                    <div class="thumbnail" style="height: 180px">
                                        <img src="../../imgs/zjtd-dtu.jpg" alt="通用的占位符缩略图">
                                        <div class="caption" style="overflow:hidden">
                                            <h4 align="center" class="text-success">内科</h4>
                                        </div>
                                    </div>
                                </div>

                                <div class="col-md-3">
                                    <div class="thumbnail" style="height: 180px">
                                        <img src="../../imgs/zjtd-dtu.jpg" alt="通用的占位符缩略图">
                                        <div class="caption" style="overflow:hidden">
                                            <h4 align="center" class="text-success">内科</h4>
                                        </div>
                                    </div>
                                </div>

                                <div class="col-md-3">
                                    <div class="thumbnail" style="height: 180px">
                                        <img src="../../imgs/zjtd-dtu.jpg" alt="通用的占位符缩略图">
                                        <div class="caption" style="overflow:hidden">
                                            <h4 align="center" class="text-success">内科</h4>
                                        </div>
                                    </div>
                                </div>

                                <div class="col-md-3">
                                    <div class="thumbnail" style="height: 180px">
                                        <img src="../../imgs/zjtd-dtu.jpg" alt="通用的占位符缩略图">
                                        <div class="caption" style="overflow:hidden">
                                            <h4 align="center" class="text-success">内科</h4>
                                        </div>
                                    </div>
                                </div>


                                <div class="col-md-3">
                                    <div class="thumbnail" style="height: 180px">
                                        <img src="../../imgs/zjtd-dtu.jpg" alt="通用的占位符缩略图">
                                        <div class="caption" style="overflow:hidden">
                                            <h4 align="center" class="text-success">内科</h4>
                                        </div>
                                    </div>
                                </div>


                                <div class="col-md-3">
                                    <div class="thumbnail" style="height: 180px">
                                        <img src="../../imgs/zjtd-dtu.jpg" alt="通用的占位符缩略图">
                                        <div class="caption" style="overflow:hidden">
                                            <h4 align="center" class="text-success">内科</h4>
                                        </div>
                                    </div>
                                </div>

                                <div class="col-md-3">
                                    <div class="thumbnail" style="height: 180px">
                                        <img src="../../imgs/zjtd-dtu.jpg" alt="通用的占位符缩略图">
                                        <div class="caption" style="overflow:hidden">
                                            <h4 align="center" class="text-success">内科</h4>
                                        </div>
                                    </div>
                                </div>

                                <div class="col-md-3">
                                    <div class="thumbnail" style="height: 180px">
                                        <img src="../../imgs/zjtd-dtu.jpg" alt="通用的占位符缩略图">
                                        <div class="caption" style="overflow:hidden">
                                            <h4 align="center" class="text-success">内科</h4>
                                        </div>
                                    </div>
                                </div>

                                <div class="col-md-3">
                                    <div class="thumbnail" style="height: 180px">
                                        <img src="../../imgs/zjtd-dtu.jpg" alt="通用的占位符缩略图">
                                        <div class="caption" style="overflow:hidden">
                                            <h4 align="center" class="text-success">内科</h4>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                    </div>
                </div>

            </div>
            <!--yishi-->

            <!--科室导航栏begin-->

            <div class="container-fluid" style="margin:0 100px;margin-top: 50px">

                <div class="row">

                    <div class="col-xs-6" style="width: 500px;height: 500px;">
                        <img src="../../imgs/hshow.jpg" style="width: 500px;height: 500px;padding: 0%" />
                    </div>

                    <div class="col-xs-6">

                        <!-- 常见疾病科室 -->
                        <div class="bt">
                            <span>&nbsp;常见疾病科室</span>
                        </div>
                        <hr color="green">
                        <div class="ksdh">
                            <ul>
                                <li style="float: left;"><a href="../departmentDetil.html">神经内科&nbsp;&nbsp;&nbsp;&nbsp;</a></li>
                                <li style="float: left;"><a href="#">消化内科&nbsp;&nbsp;&nbsp;&nbsp;</a></li>
                                <li style="float: left;"><a href="#">呼吸科&nbsp;&nbsp;&nbsp;&nbsp;</a></li>
                                <li style="float: left;"><a href="#">普通内科&nbsp;&nbsp;&nbsp;&nbsp;</a></li>
                                <li style="float: left;"><a href="#">神经外科&nbsp;&nbsp;&nbsp;&nbsp;</a></li>
                                <li style="float: left;"><a href="#">妇科&nbsp;&nbsp;&nbsp;&nbsp;</a></li>
                                <li style="float: left;"><a href="#">产科&nbsp;&nbsp;&nbsp;&nbsp;</a></li>
                                <li style="float: left;"><a href="#">儿科&nbsp;&nbsp;&nbsp;&nbsp;</a></li>
                                <li style="float: left;"><a href="#">新生儿科&nbsp;&nbsp;&nbsp;&nbsp;</a></li>
                                <li style="float: left;"><a href="#">骨科&nbsp;&nbsp;&nbsp;&nbsp;</a></li>
                                <li style="float: left;"><a href="#">眼科&nbsp;&nbsp;&nbsp;&nbsp;</a></li>
                                <li style="float: left;"><a href="#">耳鼻喉&nbsp;&nbsp;&nbsp;&nbsp;</a></li>
                                <li style="float: left;"><a href="#">神经内科&nbsp;&nbsp;&nbsp;&nbsp;</a></li>
                                <li style="float: left;"><a href="#">消化内科&nbsp;&nbsp;&nbsp;&nbsp;</a></li>
                                <li style="float: left;"><a href="#">呼吸科&nbsp;&nbsp;&nbsp;&nbsp;</a></li>
                                <li style="float: left;"><a href="#">普通内科&nbsp;&nbsp;&nbsp;&nbsp;</a></li>
                                <li style="float: left;"><a href="#">神经外科&nbsp;&nbsp;&nbsp;&nbsp;</a></li>
                                <li style="float: left;"><a href="#">妇科&nbsp;&nbsp;&nbsp;&nbsp;</a></li>
                                <li style="float: left;"><a href="#">产科&nbsp;&nbsp;&nbsp;&nbsp;</a></li>
                                <li style="float: left;"><a href="#">儿科&nbsp;&nbsp;&nbsp;&nbsp;</a></li>
                                <li style="float: left;"><a href="#">新生儿科&nbsp;&nbsp;&nbsp;&nbsp;</a></li>
                                <li style="float: left;"><a href="#">骨科&nbsp;&nbsp;&nbsp;&nbsp;</a></li>
                                <li style="float: left;"><a href="#">眼科&nbsp;&nbsp;&nbsp;&nbsp;</a></li>
                                <li style="float: left;"><a href="#">耳鼻喉&nbsp;&nbsp;&nbsp;&nbsp;</a></li>
                                <li style="float: left;"><a href="#">神经内科&nbsp;&nbsp;&nbsp;&nbsp;</a></li>
                                <li style="float: left;"><a href="#">消化内科&nbsp;&nbsp;&nbsp;&nbsp;</a></li>
                                <li style="float: left;"><a href="#">呼吸科&nbsp;&nbsp;&nbsp;&nbsp;</a></li>
                                <li style="float: left;"><a href="#">普通内科&nbsp;&nbsp;&nbsp;&nbsp;</a></li>
                                <li style="float: left;"><a href="#">神经外科&nbsp;&nbsp;&nbsp;&nbsp;</a></li>
                                <li style="float: left;"><a href="#">妇科&nbsp;&nbsp;&nbsp;&nbsp;</a></li>
                                <li style="float: left;"><a href="#">产科&nbsp;&nbsp;&nbsp;&nbsp;</a></li>
                                <li style="float: left;"><a href="#">儿科&nbsp;&nbsp;&nbsp;&nbsp;</a></li>
                                <li style="float: left;"><a href="#">新生儿科&nbsp;&nbsp;&nbsp;&nbsp;</a></li>
                                <li style="float: left;"><a href="#">骨科&nbsp;&nbsp;&nbsp;&nbsp;</a></li>
                                <li style="float: left;"><a href="#">眼科&nbsp;&nbsp;&nbsp;&nbsp;</a></li>
                                <li style="float: left;"><a href="#">耳鼻喉&nbsp;&nbsp;&nbsp;&nbsp;</a></li>
                            </ul>
                        </div>
                    </div>
                </div>

            </div>
        </div>
        <!--科室导航栏end-->

        <!--信息展示begin-->
        <div class="container-fluid" style="margin:0 100px;margin-top: 50px">

            <div class="row">

                <div class="col-xs-4">

                    <div style="width:400px;height:500px;background-color:yellow">
                        <div style="width: 400px;height:200px">
                            <img src="../../imgs/hj01.jpg" style="width: 400px;height:250px;padding:0px" />
                        </div>
                    </div>
                </div>

                <div class="col-xs-4">

                    <div style="width:400px;height:500px;background-color:yellow">
                        <div style="width: 400px;height:200px">
                            <img src="../../imgs/hj02.jpg" style="width: 400px;height:250px;padding:0px" />
                        </div>
                    </div>

                </div>

                <div class="col-xs-4">

                    <div style="width:400px;height:500px;background-color:yellow">
                        <div style="width: 400px;height:200px">
                            <img src="../../imgs/hj03.jpg" style="width: 400px;height:250px;padding:0px" />
                        </div>
                    </div>
                </div>

            </div>

        </div>
        <!--信息展示end-->

        <!--底部地址栏begin-->

        <div class="footer">

            <div class="romve">
                <p>服务热线：1599999999</p>
                <P>医院地址：医院地址：北京市昌平区回龙观东大街308号</P>
                <p>Copyright © 2019 知医治 - 京卫网审[2016]第1927号 - 京ICP备13016643-6</p>
            </div>

        </div>

        <!--底部地址栏begin-->
    </div>


    <script src="../../plugins/jquery/jquery.min.js"></script>
    <!--引入bootstrap的js文件-->
    <script src="../../plugins/bootstrap/js/bootstrap.js"></script>

    <script>
        $("#reg").click(function () {
            location.href = "../register.html"
        })
        $("#nav").click(function () {
            location.href = "../department.html"
        })
        $("#self").click(function () {
            location.href = "../man/man.html"
        })
        $("#location").click(function () {
            location.href = "../map/MapShow.html"
        })
        $("#dor").click(function () {
            location.href = "../DocDetil.html"
        })
        // 让banner - 每过4秒轮播
        $('#myCarousel').carousel({
            interval: 2000
        })
    </script>
</body>

</html>